<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>商城</title>
		<link rel="stylesheet" type="text/css" href="css/reset.css"/>
		<link rel="stylesheet" type="text/css" href="css/index.css"/>
		<link rel="stylesheet" type="text/css" href="css/theme.css"/>
		<script src="js/index.js"></script>
	</head>
	
	<body>
		
		<div class="head">
			
			<span>
				Mall商城
			</span>
			
		</div>
		
		<div class="bolck-top"></div>
		
		<div class="centen-wrapper">
		
			<div class="mine-wrapper" id="minePage">
				<div class="top">
					<img src="img/1.jpg" class="user-head"/>
					<div class="info">
						<span class="username">
							Winder
						</span>
						<span class="vip">
							黄金会员
						</span>
					</div>
					
				</div>
				
				<div class="info-wrapper">
					<div class="item">
						<span class="title">积分</span>
						<span class="number">100</span>
					</div>
					<div class="item">
						<span class="title">优惠券</span>
						<span class="number">100</span>
					</div>
					<div class="item">
						<span class="title">关注</span>
						<span class="number">100</span>
					</div>
				</div>
				
				<div class="my-order-wrapper">
					<div class="item">
						<img src="img/1.jpg"/>
						<span class="">我的订单</span>
					</div>
					<div class="item">
						<img src="img/1.jpg"/>
						<span class="">待付款</span>
					</div>
					<div class="item">
						<img src="img/1.jpg"/>
						<span class="">待收货</span>
					</div>
					<div class="item">
						
						<img src="img/1.jpg"/>
						<span class="">待评价</span>
					</div>
					<div class="item">
						<img src="img/1.jpg"/>
						<span class="">售后服务</span>
					</div>
				</div>
			
					<div class="collect-wrapper">
						<div class="item">
							<img src="img/1.jpg"/>
							<span class="title">我的收藏</span>
						</div>
						<div class="item">
							<span class="number">100</span>
							<span class="title">商品</span>
						</div>
						<div class="item">
							<span class="number">100</span>
							<span class="title">专题</span>
						</div>
						<div class="item">
							<span class="number">100</span>
							<span class="title">话题</span>
						</div>
					</div>
			
					<div class="myfoot">
						<div class="left">
							<img src="img/1.jpg" class="wdzj"/>
							<span class="item">我的足迹</span>
						</div>
						<div class="right">
							<span class="number">10</span>
							<img src="img/1.jpg" class="yjt"/>
						</div>
					</div>
				
					<div class="my-estimate">
						<div class="left">
							<img src="img/1.jpg" class="wdpj"/>
							<span class="item">我的评价</span>
						</div>
						<div class="right">
							<span class="number">10</span>
							<img src="img/1.jpg" class="yjt"/>
						</div>
					</div>
				
					<div class="area-manage">
						<div class="left">
							<img src="img/1.jpg" class="dzgl"/>
							<span class="item">地址管理</span>
						</div>
						<div class="right">
							<img src="img/1.jpg" class="yjt"/>
						</div>
					</div>
				
					<div class="my-vip">
						<div class="left">
							<img src="img/1.jpg" class="vip"/>
							<span class="item">我的会员</span>
						</div>
						<div class="right">
							<span class="number">黄金会员</span>
							<img src="img/1.jpg" class="yjt"/>
						</div>
					</div>
			
					<div class="service-center">
						<div class="left">
							<img src="img/1.jpg" class="fwzx"/>
							<span class="item">服务中心</span>
						</div>
						<div class="right">
							<img src="img/1.jpg" class="yjt"/>
						</div>
					</div>
				
					<div class="system-settings">
						<div class="left">
							<img src="img/1.jpg" class="szzx"/>
							<span class="item">设置中心</span>
						</div>
						<div class="right">
							<img src="img/1.jpg" class="yjt"/>
						</div>
					</div>
				
			</div>
			
			<div class="main-wrapper" id="mainPage">
				<span style="font-size: 5vw;">
					首页
				</span>
				
				<div class="canchu">
					<img src="img/1.jpg"/>
					<span>发现</span>
				</div>
				
				<div class="background">
					<img src="img/1.jpg"/>
					
					<div class="bg2">
						<img src="img/1.jpg"/>
						<span>热门</span>
					</div>
				</div>
				
				<div class="spring">
					<div class="left">
						<div class="five">
							<span>三个春天的生活新提案</span>
						</div>
						<div class="cc">
							<span>好物</span>
						</div>
						
					</div>
					<div class="right">
						<span>￥99元起</span>
					</div>
				</div>
				
				<div class="spring-dowm">
						<div class="left">
							<img src="img/1.jpg" class="huixin"/>
							<span class="item">100</span>
							<img src="img/1.jpg"/ class="yanjin">
							<span class="item">10000</span>
						</div>
						<div class="right">
							<img src="img/1.jpg"/ class="qipao">
							<span class="number">100</span>
							<img src="img/1.jpg" class="yjt"/>
						</div>
				</div>
				
				
				<div class="canchu">
					<img src="img/1.jpg"/>
					<span>餐厨专题</span>
				</div>
				
				<div class="background">
					<img src="img/1.jpg"/>
					
					<div class="bg4">
						<img src="img/1.jpg"/>
						<span>热门</span>
					</div>
				</div>
				
				<div class="spring">
					<div class="left">
						<div class="five">
							<span>四个春天的生活新提案</span>
						</div>
						<div class="cc">
							<span>餐厨起居好物</span>
						</div>
						
					</div>
					<div class="right">
						<span>￥99元起</span>
					</div>
				</div>
				
				<div class="spring-dowm">
						<div class="left">
							<img src="img/1.jpg" class="huixin"/>
							<span class="item">100</span>
							<img src="img/1.jpg"/ class="yanjin">
							<span class="item">10000</span>
						</div>
						<div class="right">
							<img src="img/1.jpg"/ class="qipao">
							<span class="number">100</span>
							<img src="img/1.jpg" class="yjt"/>
						</div>
				</div>
				
				
				
				<div class="canchu">
					<img src="img/1.jpg"/>
					<span>餐厨专题</span>
				</div>
				
				<div class="background">
					<img src="img/1.jpg"/>
					<div class="bg5">
						<img src="img/1.jpg"/>
					</div>
					<div class="bg6">
						<img src="img/1.jpg"/>
						<span>热门</span>
					</div>
				</div>
				
				<div class="spring">
					<div class="left">
						<div class="five">
							<span>五个春天的生活新提案</span>
						</div>
						<div class="cc">
							<span>餐厨起居好物</span>
						</div>
						
					</div>
					<div class="right">
						<span>￥99元起</span>
					</div>
				</div>
				
				<div class="spring-dowm">
						<div class="left">
							<img src="img/1.jpg" class="huixin"/>
							<span class="item">100</span>
							<img src="img/1.jpg"/ class="yanjin">
							<span class="item">10000</span>
						</div>
						<div class="right">
							<img src="img/1.jpg"/ class="qipao">
							<span class="number">100</span>
							<img src="img/1.jpg" class="yjt"/>
						</div>
				</div>
				
				
				
			</div>
			
			<div class="category-wrapper" id="categoryPage">
			
			<div class="category">
					<div class="item">
						
						<span class="zi">全部专题</span>
					</div>
					<div class="item">
						
						<span class="zi">服装专题</span>
					</div>
					<div class="item">
						
						<span class="zi">餐厨专题</span>
					</div>
					<div class="item">
						
						<span class="zi">配件专题</span>
					</div>
					<div class="item">
						
						<span class="zi">居家专题</span>
					</div>
					<div class="item">
						
						<span class="zi">洗护专题</span>
					</div>-->
				</div>-->
			
			<div class="category">
					<div class="item">
						
						<span class="zi">全部专题</span>
					</div>
					<div class="item">
						
						<span class="zi">服装专题</span>
					</div>
					<div class="item">
						
						<span class="zi">餐厨专题</span>
					</div>
					<div class="item">
						
						<span class="zi">配件专题</span>
					</div>
					<div class="item">
						
						<span class="zi">居家专题</span>
					</div>
					<div class="item">
						
						<span class="zi">洗护专题</span>
					</div>-->
				</div>-->
			
			<div class="category">
					<div class="item">
						
						<span class="zi">全部专题1</span>
					</div>
					<div class="item">
						
						<span class="zi">服装专题1</span>
					</div>
					<div class="item">
						
						<span class="zi">餐厨专题1</span>
					</div>
					<div class="item">
						
						<span class="zi">配件专题1</span>
					</div>
					<div class="item">
						
						<span class="zi">居家专题1</span>
					</div>
					<div class="item">
						
						<span class="zi">洗护专题1</span>
					</div>-->
				</div>-->
			
			<div class="category">
					<div class="item">
						
						<span class="zi">全部专题2</span>
					</div>
					<div class="item">
						
						<span class="zi">服装专题2</span>
					</div>
					<div class="item">
						
						<span class="zi">餐厨专题2</span>
					</div>
					<div class="item">
						
						<span class="zi">配件专题2</span>
					</div>
					<div class="item">
						
						<span class="zi">居家专题2</span>
					</div>
					<div class="item">
						
						<span class="zi">洗护专题2</span>
					</div>-->
				</div>-->
			
			<div class="category">
					<div class="item">
						
						<span class="zi">全部专题</span>
					</div>
					<div class="item">
						
						<span class="zi">服装专题</span>
					</div>
					<div class="item">
						
						<span class="zi">餐厨专题</span>
					</div>
					<div class="item">
						
						<span class="zi">配件专题</span>
					</div>
					<div class="item">
						
						<span class="zi">居家专题</span>
					</div>
					<div class="item">
						
						<span class="zi">洗护专题</span>
					</div>-->
				</div>-->
				
				<div class="category">
					<div class="item">
						
						<span class="zi">全部专题</span>
					</div>
					<div class="item">
						
						<span class="zi">服装专题</span>
					</div>
					<div class="item">
						
						<span class="zi">餐厨专题</span>
					</div>
					<div class="item">
						
						<span class="zi">配件专题</span>
					</div>
					<div class="item">
						
						<span class="zi">居家专题</span>
					</div>
					<div class="item">
						
						<span class="zi">洗护专题</span>
					</div>-->
				</div>-->
				
				<div class="category">
					<div class="item">
						
						<span class="zi">全部专题</span>
					</div>
					<div class="item">
						
						<span class="zi">服装专题</span>
					</div>
					<div class="item">
						
						<span class="zi">餐厨专题</span>
					</div>
					<div class="item">
						
						<span class="zi">配件专题</span>
					</div>
					<div class="item">
						
						<span class="zi">居家专题</span>
					</div>
					<div class="item">
						
						<span class="zi">洗护专题</span>
					</div>-->
				</div>-->
				
				<div class="category">
					<div class="item">
						
						<span class="zi">全部专题</span>
					</div>
					<div class="item">
						
						<span class="zi">服装专题</span>
					</div>
					<div class="item">
						
						<span class="zi">餐厨专题</span>
					</div>
					<div class="item">
						
						<span class="zi">配件专题</span>
					</div>
					<div class="item">
						
						<span class="zi">居家专题</span>
					</div>
					<div class="item">
						
						<span class="zi">洗护专题</span>
					</div>-->
				</div>-->
			
			</div>
			
			<div class="theme-wrapper" id="themePage">
				
				<div class="top-scroll" id="topScroll">
					<div class="item-wrapper" id="touchItemWrapper">
						<div class="item">
							<img src="img/1.jpg"/>
							<span>全部专题3</span>
						</div>
						<div class="item">
							<img src="img/1.jpg"/>
							<span>服装专题3</span>
						</div>
						<div class="item">
							<img src="img/1.jpg"/>
							<span>餐厨专题3</span>
						</div>
						<div class="item">
							<img src="img/1.jpg"/>
							<span>配件专题3</span>
						</div>
						<div class="item">
							<img src="img/1.jpg"/>
							<span>居家专题3</span>
						</div>
						<div class="item">
							<img src="img/1.jpg"/>
							<span>洗护专题3</span>
						</div>
					</div>
				</div>
				
				<!--主题中间部分start-->
				<div class="canchu">
					<img src="img/1.jpg"/>
					<span>餐厨专题</span>
				</div>
				
				<div class="background">
					<img src="img/1.jpg"/>
					
					
				</div>
				
				<div class="spring">
					<div class="left">
						<div class="five">
							<span>三个春天的生活新提案</span>
						</div>
						<div class="cc">
							<span>餐厨起居好物</span>
						</div>
						
					</div>
					<div class="right">
						<span>￥99元起</span>
					</div>
				</div>
				
				<div class="spring-dowm">
						<div class="left">
							<img src="img/1.jpg" class="huixin"/>
							<span class="item">100</span>
							<img src="img/1.jpg"/ class="yanjin">
							<span class="item">10000</span>
						</div>
						<div class="right">
							<img src="img/1.jpg"/ class="qipao">
							<span class="number">100</span>
							<img src="img/1.jpg" class="yjt"/>
						</div>
				</div>
				
				
				<div class="canchu">
					<img src="img/1.jpg"/>
					<span>餐厨专题</span>
				</div>
				
				<div class="background">
					<img src="img/1.jpg"/>
					
					
				</div>
				
				<div class="spring">
					<div class="left">
						<div class="five">
							<span>四个春天的生活新提案</span>
						</div>
						<div class="cc">
							<span>餐厨起居好物</span>
						</div>
						
					</div>
					<div class="right">
						<span>￥99元起</span>
					</div>
				</div>
				
				<div class="spring-dowm">
						<div class="left">
							<img src="img/1.jpg" class="huixin"/>
							<span class="item">100</span>
							<img src="img/1.jpg"/ class="yanjin">
							<span class="item">10000</span>
						</div>
						<div class="right">
							<img src="img/1.jpg"/ class="qipao">
							<span class="number">100</span>
							<img src="img/1.jpg" class="yjt"/>
						</div>
				</div>
				
				
				
				<div class="canchu">
					<img src="img/1.jpg"/>
					<span>餐厨专题</span>
				</div>
				
				<div class="background">
					<img src="img/1.jpg"/>
					
					
				</div>
				
				<div class="spring">
					<div class="left">
						<div class="five">
							<span>五个春天的生活新提案</span>
						</div>
						<div class="cc">
							<span>餐厨起居好物</span>
						</div>
						
					</div>
					<div class="right">
						<span>￥99元起</span>
					</div>
				</div>
				
				<div class="spring-dowm">
						<div class="left">
							<img src="img/1.jpg" class="huixin"/>
							<span class="item">100</span>
							<img src="img/1.jpg"/ class="yanjin">
							<span class="item">10000</span>
						</div>
						<div class="right">
							<img src="img/1.jpg"/ class="qipao">
							<span class="number">100</span>
							<img src="img/1.jpg" class="yjt"/>
						</div>
				</div>
				
				
				
				
				
			</div>
	
		</div>

		<div class="bolck-bottom"></div>

		<div class="foot">
			<div class="item" id="mainItem">
				<img src="img/1.jpg"/>
				<span>首页</span>
			</div>
			<div class="item" id="categoryItem">
				<img src="img/1.jpg"/>
				<span>分类</span>
			</div>
			<div class="item" id="themeItem">
				<img src="img/1.jpg"/>
				<span>专题</span>
			</div>
			<div class="item" id="mineItem">
				<img src="img/1.jpg"/>
				<span>我的</span>
			</div>
		</div>
	
	</body>
</html>
